<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>权限管理</title>
    <link rel="stylesheet" href="../../component/pear/css/pear.css" />
</head>

<body class="pear-container">
    <!-- <div class="layui-card">
    <div class="layui-card-body">
        <form class="layui-form" action="">
        	<div class="layui-form-item">
        		<div class="layui-form-item layui-inline">
        			<label class="layui-form-label">规则名</label>
        			<div class="layui-input-inline">
        				<input type="text" name="name" placeholder="" class="layui-input">
        			</div>
        		</div>
        		< !-- <div class="layui-form-item layui-inline">
        			<label class="layui-form-label">性别</label>
        			<div class="layui-input-inline">
        				<input type="text" name="realName" placeholder="" class="layui-input">
        			</div>
        		</div>
        		<div class="layui-form-item layui-inline">
        			<label class="layui-form-label">邮箱</label>
        			<div class="layui-input-inline">
        				<input type="text" name="realName" placeholder="" class="layui-input">
        			</div>
        		</div> -- >
        		<div class="layui-form-item layui-inline">
        			<button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="permission-query">
        				<i class="layui-icon layui-icon-search"></i>
        				查询
        			</button>
        			<button type="reset" class="pear-btn pear-btn-md">
        				<i class="layui-icon layui-icon-refresh"></i>
        				重置
        			</button>
        		</div>
        	</div>
        </form>
    </div>
</div> -->
    <div class="layui-card">
        <div class="layui-card-body">
            <table id="data-table" lay-filter="data-table"></table>
        </div>
    </div>



    <script type="text/html" id="permission-toolbar">
        <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="add">
            <i class="layui-icon layui-icon-add-1"></i>
            新增
        </button>
        <button class="pear-btn pear-btn-danger pear-btn-md" lay-event="batchRemove">
            <i class="layui-icon layui-icon-delete"></i>
            删除
        </button>
        <button class="pear-btn pear-btn-success pear-btn-md" lay-event="expandAll">
            <i class="layui-icon layui-icon-spread-left"></i>
            展开
        </button>
        <button class="pear-btn pear-btn-success pear-btn-md" lay-event="foldAll">
            <i class="layui-icon layui-icon-shrink-right"></i>
            折叠
        </button>
    </script>

    <script type="text/html" id="permission-bar">
        <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="edit"><i
                class="layui-icon layui-icon-edit"></i></button>
        <button class="pear-btn pear-btn-danger pear-btn-sm" lay-event="remove"><i
                class="layui-icon layui-icon-delete"></i></button>
    </script>

    <script type="text/html" id="permission-type">
        {{#if (d.type == 0) { }}
        <span>目录</span>
        {{# }else if(d.type == 1){ }}
        <span>菜单</span>
        {{# }else if(d.type == 2){ }}
        <span>API</span>
        {{# } }}
    </script>

    <script type="text/html" id="permission-status">
        <input type="checkbox" name="status" value="{{d.id}}" lay-skin="switch" lay-text="启用|禁用" lay-filter="status"
            {{ d.status== true ? 'checked' : '' }} />
    </script>

    <script type="text/html" id="icon">
        <i class="layui-icon {{d.icon}}"></i>
    </script>



    <script src="../../component/layui/layui.js"></script>
    <script src="../../component/pear/pear.js"></script>
    <script src="../../lms/base64.js"></script>
    <!-- <script src="../../lms/md5.js"></script> -->
    <script src="../../lms/common.js"></script>
    <script src="../../lms/config.js"></script>



    <script>
        //鹰：
        if (!checkLogin()) {
            location.href = lms_config.base_path + "/login.html";
        }



        layui.use(['table', 'form', 'jquery', 'treetable', 'common'], function () {
            let table = layui.table;
            let form = layui.form;
            let $ = layui.jquery;
            let treetable = layui.treetable;
            let common = layui.common;


            let MODULE_PATH = "permission/";


            window.render = function (where) {
                
				$request({
                    url: lms_config.api_url + "/adminapi/v1/setting/Permission",
					type: 'GET',
					//contentType: 'application/json',
					//data: { status: status },
					//headers: {Authorization: getUserInfo()["token"]},
					dataType: 'json',
				}).then(function(ret) {

                    for (let item in ret.data) {
                        //ret.data[item].permissionId = ret.data[item].id;
                        //ret.data[item].permissionName = ret.data[item].id;
                        //ret.data[item].permissionType = ret.data[item].role_name;
                        ret.data[item].permissionCode = ret.data[item].unique_auth;
                        //ret.data[item].permissionUrl = ret.data[item].status;
                        //ret.data[item].openType = null;
                        ret.data[item].parentId = ret.data[item].pid;
                        //ret.data[item].icon = "";
                        //ret.data[item].sort = null;
                        //ret.data[item].enable = ret.data[item].status;
                        //ret.data[item].checkArr = "";
                    }

                    treetable.render({
                        elem: '#data-table',
                        treeColIndex: 1,
                        treeSpid: 0,
                        treeIdName: 'id',
                        treePidName: 'pid',
                        skin: 'line',
                        treeDefaultClose: true,
                        toolbar: '#permission-toolbar',
                        page: false,
                        cols: [
                            [{
                                    type: 'checkbox'
                                },
                                //{title: 'id', field: 'id', align:'center'},
                                {
                                    title: '名称',
                                    field: 'name',
                                    minWidth: 200,
                                },
                                {
                                    title: '图标',
                                    field: 'icon',
                                    templet: '#icon',
                                    width: 60,
                                    align: 'center',
                                },
                                {
                                    title: '类型',
                                    field: 'type',
                                    templet: '#permission-type',
                                    width: 60,
                                    align: 'center',
                                },
                                {
                                    title: 'api',
                                    field: 'api_path',
                                },
                                {
                                    title: '方法',
                                    field: 'methods',
                                },
                                {
                                    title: '菜单',
                                    field: 'menu_path',
                                },
                                {
                                    title: '排序',
                                    field: 'sort',
                                    width: 60,
                                },
                                {
                                    title: '启用',
                                    field: 'status',
                                    templet: '#permission-status',
                                    width: 100,
                                    align: 'center',
                                },
                                {
                                    title: '操作',
                                    templet: '#permission-bar',
                                    width: 120,
                                    align: 'center',
                                }
                            ]
                        ],
                        data: ret.data,
                        //where: where,
                        /*parseData: function (ret) { //ret 即为原始返回的数据
                            for (let item in ret.data) {
                                //ret.data[item].permissionId = ret.data[item].id;
                                //ret.data[item].permissionName = ret.data[item].id;
                                //ret.data[item].permissionType = ret.data[item].role_name;
                                ret.data[item].permissionCode = ret.data[item].unique_auth;
                                //ret.data[item].permissionUrl = ret.data[item].status;
                                //ret.data[item].openType = null;
                                ret.data[item].parentId = ret.data[item].pid;
                                //ret.data[item].icon = "";
                                //ret.data[item].sort = null;
                                //ret.data[item].enable = ret.data[item].status;
                                //ret.data[item].checkArr = "";
                            }
                            //console.log(ret);
                            return ret;
                        },
                        */
                    });

				}).catch(function(ret) {
                    layer.msg("出错[" + ret.status + "]：" + ret.responseText, {
                        icon: 2,
                        //icon: 5,
                        time: 1000
                    });

                    //console.error(ret);
                    // alert("出错" + ret.status + "：" + ret.responseText);
				});
            }
            window.render();



            //弹出窗设置 自己设置弹出百分比
            function screen() {
                if (typeof width !== 'number' || width === 0) {
                    width = $(window).width() * 0.8;
                }
                if (typeof height !== 'number' || height === 0) {
                    height = $(window).height() - 20;
                }
                return [width + 'px', height + 'px'];
            }

            table.on('tool(data-table)', function (obj) {
                if (obj.event === 'remove') {
                    window.remove(obj);
                } else if (obj.event === 'edit') {
                    window.edit(obj);
                }
            })


            table.on('toolbar(data-table)', function (obj) {
                if (obj.event === 'add') {
                    window.add();
                } else if (obj.event === 'refresh') {
                    window.refresh();
                } else if (obj.event === 'batchRemove') {
                    window.batchRemove(obj);
                } else if (obj.event === 'expandAll') {
                    treetable.expandAll("#data-table");
                } else if (obj.event === 'foldAll') {
                    treetable.foldAll("#data-table");
                }
            });

            window.add = function () {
                layer.open({
                    type: 2,
                    maxmin: true,
                    title: '新增',
                    shade: 0.1,
                    //area: ['450px', '500px'],
                    area: screen(),
                    content: MODULE_PATH + 'add.html?operation=add'
                });
            }

            window.edit = function (obj) {
                //console.log(obj)
                //console.log(encodeURI(obj.data.name))
                //console.log(decodeURI(encodeURI(obj.data.name)))
                layer.open({
                    type: 2,
                    title: '修改',
                    shade: 0.1,
                    //area: ['450px', '500px'],
                    area: screen(),
                    content: MODULE_PATH + 'add.html?operation=edit&id=' + obj.data.id +
                        '&type=' + obj.data.type +
                        '&show=' + obj.data.show +
                        '&status=' + obj.data.status +
                        '&name=' + encodeURI(encodeURI(obj.data.name)) +
                        //'&parent_name=' + obj.data.parent_name +
                        '&pid=' + obj.data.pid +
                        '&methods=' + obj.data.methods +
                        '&api_path=' + obj.data.api_path +
                        '&menu_path=' + obj.data.menu_path +
                        '&icon=' + obj.data.icon +
                        '&sort=' + obj.data.sort
                });
            }
            window.remove = function (obj) {
                layer.confirm('确定要删除该权限', {
                    icon: 3,
                    title: '提示'
                }, function (index) {
                    layer.close(index);
                    let loading = layer.load();
                    $.ajax({
                        url: lms_config.api_url + "/adminapi/v1/setting/Permission/" + obj.data['id'],
                        type: 'DELETE',
                        headers: {Authorization: getUserInfo()["token"]},
                        //contentType: 'application/json',
                        //data: {"data": obj.data['id']},
                        dataType: 'json',

                        success: function (ret) {
                            layer.close(loading);
                            if (ret && ret.code == 0) {
                                layer.msg(ret.msg, {
                                    icon: 1,
                                    time: 1000
                                }, function () {
                                    obj.del();
                                });
                            } else {
                                layer.msg(ret.msg, {
                                    icon: 2,
                                    //icon: 5,
                                    time: 1000
                                });
                            }
                        },
                        error: function (ret) {
                            console.error(ret);
                            alert("出错" + ret.status + "：" + ret.responseText);
                        }, //表示如果请求响应出现错误，会执行的回调函数
                    });
                });
            }

            window.batchRemove = function (obj) {

                //方法1：直接获得所有选择的ID
                let checkIds = common.checkField(obj, 'id');
                if (checkIds === "") {
                    layer.msg("未选中数据", {
                        icon: 3,
                        time: 1000
                    });
                    return false;
                }

                //方法2：获得所有选择的项目及其所有属性
                /*
                let checkIds = '';
                let data = table.checkStatus(obj.config.id).data;
                if (data.length === 0) {
                    layer.msg("未选中数据", {
                        icon: 3,
                        time: 1000
                    });
                    return false;
                }
                for (let i = 0; i < data.length; i++) {
                    checkIds += data[i].id + ",";
                }
                checkIds = checkIds.substr(0, checkIds.length - 1);
                */



                layer.confirm('确定要删除这些权限', {
                    icon: 3,
                    title: '提示'
                }, function (index) {
                    layer.close(index);
                    let loading = layer.load();
                    $.ajax({
                        url: lms_config.api_url + "/adminapi/v1/setting/Permission/" + checkIds.replace(',', '_'),
                        type: 'DELETE',
                        headers: {Authorization: getUserInfo()["token"]},
                        //contentType: 'application/json',
                        //data: {"data": checkIds},
                        dataType: 'json',

                        success: function (ret) {
                            layer.close(loading);
                            if (ret && ret.code == 0) {
                                layer.msg(ret.msg, {
                                    icon: 1,
                                    time: 1000
                                }, function () {
                                    window.render();
                                    //table.reload('data-table');
                                });
                            } else {
                                layer.msg(ret.msg, {
                                    icon: 2,
                                    //icon: 5,
                                    time: 1000
                                });
                            }
                        },
                        error: function (ret) {
                            console.error(ret);
                            alert("出错" + ret.status + "：" + ret.responseText);
                        }, //表示如果请求响应出现错误，会执行的回调函数
                    });
                });
            }

            window.refresh = function () {
                window.render();
                //table.reload('data-table');
                ///top.location.reload();
                ///parent.location.reload();
            }
            


            form.on('submit(permission-query)', function (data) {
                //console.log(data)
                if (!data.field.name)
                    delete data.field.name;
                let where = "";
                for (let k in data.field)
                    where += k + '=' + data.field[k] + "&";

                window.render(where);
                //treetable.reload('data-table',{where: data.field});
                //table.reload('data-table',{where: data.field});
                return false;
            });


            form.on('switch(status)', function (data) {
		        //layer.tips(this.value + ' ' + this.name + '：'+ obj.elem.checked, obj.othis);

                var status = data.elem.checked ? 1 : 0;
                var id = this.value;
                var load = layer.load();
                $.ajax({
                    url: lms_config.api_url + "/adminapi/v1/setting/Permission/" + id,
                    type: 'PUT',
                    headers: {Authorization: getUserInfo()["token"]},
                    //contentType: 'application/json',
                    data: { status: status },
                    dataType: 'json',
                    
                    success: function (ret) {
                        layer.close(load);
                        if (ret && ret.code == 0) {
                            layer.msg(ret.msg, {
                                icon: 1,
                                time: 1500
                            });
                        } else {
                            layer.msg(ret.msg, {
                                icon: 2,
                                //icon: 5,
                                time: 1500
                            }, function () {
                                $(data.elem).prop('checked', !$(data.elem).prop('checked'));
                                form.render();
                            });
                        }
                    },
                    error: function (ret) {
                        console.error(ret);
                        alert("出错" + ret.status + "：" + ret.responseText);
                    }, //表示如果请求响应出现错误，会执行的回调函数
                });

                //console.log(data);
                //console.log(data.elem.checked);
            });
        })
    </script>
</body>

</html>